Form Validation এবং Error Handling

Flutter এ Form Validation এবং Error Handling একটি গুরুত্বপূর্ণ বিষয়, বিশেষ করে যখন আপনি এমন একটি ফর্ম তৈরি করতে চান যেখানে ইউজার থেকে ইনপুট সংগ্রহ করা হয় (যেমন লগইন ফর্ম, রেজিস্ট্রেশন ফর্ম, প্রোফাইল আপডেট ইত্যাদি)। Form Validation নিশ্চিত করে যে ইউজার সঠিক তথ্য ইনপুট করছে এবং Error Handling এর মাধ্যমে ইনপুট ভুল হলে ইউজারকে সঠিক মেসেজ প্রদর্শন করা হয়। নিচে বিস্তারিত আলোচনা এবং উদাহরণ দেওয়া হলো।

Form Validation সেটআপ করার ধাপ:

ধাপ ১: একটি Form তৈরি করা:

• Flutter এ Form Widget এবং TextFormField ব্যবহার করে ফর্ম তৈরি করা হয়।
• একটি GlobalKey তৈরি করা হয় যা ফর্মের স্টেট পরিচালনা করতে সহায়তা করে।

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Form Validation',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Form Validation Example'),
        ),
        body: Padding(
          padding: EdgeInsets.all(16.0),
          child: MyCustomForm(),
        ),
      ),
    );
  }
}

class MyCustomForm extends StatefulWidget {
  @override
  _MyCustomFormState createState() => _MyCustomFormState();
}

class _MyCustomFormState extends State<MyCustomForm> {
  final _formKey = GlobalKey<FormState>();
  String? _email;
  String? _password;

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: <Widget>[
          TextFormField(
            decoration: InputDecoration(labelText: 'Email'),
            validator: (value) {
              if (value == null || value.isEmpty) {
                return 'Please enter your email';
              } else if (!RegExp(r'^[^@]+@[^@]+\.[^@]+').hasMatch(value)) {
                return 'Please enter a valid email';
              }
              return null;
            },
            onSaved: (value) {
              _email = value;
            },
          ),
          TextFormField(
            decoration: InputDecoration(labelText: 'Password'),
            obscureText: true,
            validator: (value) {
              if (value == null || value.isEmpty) {
                return 'Please enter your password';
              } else if (value.length < 6) {
                return 'Password must be at least 6 characters long';
              }
              return null;
            },
            onSaved: (value) {
              _password = value;
            },
          ),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
                _formKey.currentState!.save();
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text('Form is valid, processing data...')),
                );
              } else {
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text('Form is not valid, please check')),
                );
              }
            },
            child: Text('Submit'),
          ),
        ],
      ),
    );
  }
}

ধাপ ২: Form Validation এবং Error Handling কনফিগার করা:

• GlobalKey: একটি GlobalKey তৈরি করা হয় যা ফর্মের স্টেট পরিচালনা করে। এটি Form Widget এ পাস করা হয়।
• TextFormField: প্রতিটি ইনপুট ফিল্ড TextFormField ব্যবহার করে তৈরি করা হয়। এটি validator প্রপার্টি গ্রহণ করে, যা ইনপুট ফিল্ডে প্রবেশ করা তথ্য সঠিক কিনা তা চেক করে।
• Validator Function:
  • validator ফাংশন ইনপুটের মান চেক করে এবং কোনো ভুল থাকলে একটি ত্রুটির বার্তা রিটার্ন করে।
  • যদি ইনপুট সঠিক হয়, তাহলে null রিটার্ন করা হয়, যা নির্দেশ করে যে ইনপুট সঠিক।

ধাপ ৩: ফর্ম সাবমিট করা এবং Validation চেক করা:

• একটি বাটন যোগ করা হয় যা ক্লিক করলে ফর্মের Validation চেক করে। যদি ফর্ম সঠিক হয়, তাহলে একটি স্ন্যাকবার (Snackbar) প্রদর্শিত হয়।
• validate() মেথড ফর্মের প্রতিটি validator কল করে এবং চেক করে সব ইনপুট সঠিক আছে কিনা।
• save() মেথড ফর্মের স্টেট সংরক্ষণ করে এবং ইনপুটের মান _email এবং _password ভেরিয়েবল এ সংরক্ষণ করে।

Error Handling এবং Snackbar প্রদর্শন করা:

• যদি ফর্ম সঠিক না হয়, তাহলে ScaffoldMessenger ব্যবহার করে একটি Snackbar প্রদর্শন করা হয়, যা ইউজারকে ইনপুটের ত্রুটি সম্পর্কে জানায়।

Form Validation এর গুরুত্বপূর্ণ পয়েন্টস:

Required Validation:

• প্রতিটি ইনপুট ফিল্ডে validator ফাংশনের মাধ্যমে চেক করা হয় যে ইনপুট ফিল্ড ফাঁকা আছে কিনা।

Pattern Matching (RegExp):

• Email ইনপুট ফিল্ডে একটি রেগুলার এক্সপ্রেশন (RegExp) ব্যবহার করে ইমেইল সঠিক ফরম্যাটে আছে কিনা চেক করা হয়।

Custom Validation:

• পাসওয়ার্ড ফিল্ডে চেক করা হয় পাসওয়ার্ডের দৈর্ঘ্য অন্তত ৬ ক্যারেক্টার আছে কিনা।

Snackbar দিয়ে Error Message প্রদর্শন:

• ScaffoldMessenger ব্যবহার করে ইউজারকে একটি Snackbar মেসেজের মাধ্যমে ইনপুটের ত্রুটি সম্পর্কে জানানো হয়।

Form Validation এর সুবিধা:

• ব্যবহারকারীর ইনপুট চেক করা: Form Validation এর মাধ্যমে ইউজার সঠিক তথ্য ইনপুট করছে কিনা তা নিশ্চিত করা যায়।
• Error Handling: ইউজার যদি ভুল তথ্য ইনপুট করে, তাহলে ফর্মের মাধ্যমে সেই ভুল ধরিয়ে দিয়ে সঠিক তথ্য ইনপুট করতে উৎসাহিত করা হয়।
• ফর্মের সঠিকতা নিশ্চিত করা: Validation নিশ্চিত করে যে ইউজারের দেয়া তথ্য প্রক্রিয়াকরণের জন্য উপযুক্ত।

Form Validation এবং Error Handling এর মাধ্যমে ইউজারের অভিজ্ঞতা উন্নত হয় এবং অ্যাপ্লিকেশন সঠিকভাবে কাজ করে।